import React, { useState } from 'react';
import { Descriptions, Tabs } from 'antd';
import RelationFn from './index';
const { TabPane } = Tabs;

export default function Relation(props) {
  const [value, setValue] = useState('');

  return (
    <div className='p30p20'>
      <Descriptions column={2}>
        <Descriptions.Item label='函数名称'>{props.record.name}</Descriptions.Item>
        <Descriptions.Item label='函数code'>{props.record.code}</Descriptions.Item>
        <Descriptions.Item label='引用情况' />
      </Descriptions>
      <Tabs defaultActiveKey='1'>
        <TabPane tab='策略' key='1'>
          <div style={{ padding: '10px 0' }}>
            <RelationFn relationApi='widthStrategyList' code={props.record.code} />
          </div>
        </TabPane>
        <TabPane tab='组件' key='2'>
          <div style={{ padding: '10px 0' }}>
            <RelationFn relationApi='widthComponentList' code={props.record.code} />
          </div>
        </TabPane>
      </Tabs>
    </div>
  );
}
